import React, { Component } from 'react';
import './index.scss';

class Home extends Component {

    constructor(props){
        super(props);
        this.mycanvas = React.createRef();
    }

    canvasApp = () => {
        const myCanvas = this.mycanvas.current;
        const ctx = myCanvas.getContext('2d');
        
        this.drewRect(ctx);
    }

    drewRect = ctx => {
        ctx.fillStyle = "rgb(200,0,0)";
        ctx.fillRect (10, 10, 55, 50);
    }

    componentDidMount(){
        this.canvasApp();
    }

    render() {
        return <div>
            <canvas ref={this.mycanvas} width="500" height="500"></canvas>
        </div>
    }
}

export default Home